<template>
<view class="container">
    <view class="shopDetail">
        <view class="imgInfo cf">
            <view class="fl">
                <image :src="store_data.now_store.all_pic[0]"></image>
            </view>
            <view class="fl ml20">
                <view class="brand">{{store_data.now_store.name}}</view>
                <view class="rateInfo">
                    <view class="star fl">
                        <block v-if="store_data.store_score > 0">
                            <block v-for="(i, store_list_star_index) in [0,1,2,3,4]" :key="store_list_star_index">
                                <image src="../../static/images/full_star.png" v-if="store_data.store_score >= i+1"></image>
                                <image src="../../static/images/mid_star.png" v-else-if="store_data.store_score > i"></image>
                                <image src="../../static/images/none_star.png" v-else></image>
                            </block>
                        </block>
                        <block v-else>
                            <image src="../../static/images/full_star.png"></image>
                            <image src="../../static/images/full_star.png"></image>
                            <image src="../../static/images/full_star.png"></image>
                            <image src="../../static/images/mid_star.png"></image>
                            <image src="../../static/images/none_star.png"></image>
                        </block>
                    </view>
                </view>
            </view>
        </view>
        <view class="linkInfo" @tap="openMap" :data-lat="store_data.now_store.lat" :data-lng="store_data.now_store.long" data-type="baidu" :data-name="store_data.now_store.name" :data-address="store_data.now_store.adress">
            <view class="text">{{store_data.now_store.adress}}</view>
            <view class="phoneBox" @click.stop="callPhone" :data-phone="store_data.now_store.phone">
                <view class="phone"></view>
            </view>
        </view>
        <view class="linkInfo link" @tap="goShop" v-if="store_data.now_store.have_shop == 1">
            <view class="icon shop">快</view>
            <view class="text">快店</view>
        </view>
        <view class="linkInfo link" @tap="goPrepay" v-if="store_data.now_store.pay_in_store == 1">
            <view class="icon store">付</view>
            <view class="text">快速买单</view>
        </view>
        <!--view class="linkInfo link" bindtap="goMerchantPage" wx:if="{{1 == 1}}">
            <view class="icon merchant">商</view>
            <view class="text">商家主页</view>
        </view-->
    </view>
    <view class="group_list bw" v-if="store_data.store_group_list.length > 0">
        <view class="titleDiv">
            <view class="title">{{store_data.store_group_list_name}}</view>
        </view>
        <block v-for="(item, group_list) in store_data.store_group_list" :key="group_list">
            <view class="menulink" @tap="goGroup" :data-group_id="item.group_id">
                <view class="fl ml_left">
                    <image :src="item.list_pic"></image>
                    <view :class="'pos ' + (item.pin_num == 0 ? 'group' : 'fight')"></view>         
                </view>
                <view class="ml_menu">
                    <view class="tit">{{item.group_name}}</view>
                    <view class="cf bot">
                        <view class="fl cf">
                            <view class="fl val">
                                <text class="mall">￥</text>
                                <text class="price">{{item.price}}</text>
                            </view>
                            <view class="fl rackrate">{{item.old_price}}</view>
                        </view>
                        <view class="fr sold">已售 {{item.sale_count}}</view>
                    </view>
                </view>
            </view>
        </block>
    </view>
</view>
</template>

"<script>
import common from '../../utils/common.js'
var app = getApp();
var _this;

export default {
  data() {
    return {
      store_id: 0,
      store_data: {},
      userInfo: ''
    };
  },

  onUnload: function () {},
  onHide: function () {},
  onShow: function () {
    wx.showShareMenu({
      withShareTicket: true
    });
  },
  onReady: function () {},
  onLoad: function (options) {
    _this = this;
    common.setMainColor(_this);
    wx.showShareMenu({
      withShareTicket: true
    });

    _this.setData({
      store_id: options.store_id
    });

    common.getUserInfo(function (userInfo) {
      _this.setData({
        userInfo: userInfo
      });

      if (app.globalData.scene == 1044 || app.globalData.scene == 1007) {
        var obj = {
          'spread_openid': options.openId,
          'now_user_openid': userInfo.wxapp_openid,
          'code': wx.getStorageSync('code')
        };
        common.post('Home&a=wxapp_openid', obj, "scene", _this);
      }
    });
    common.post('Merchant&a=shop', {
      store_id: _this.store_id
    }, "setMainContent", _this);
  },
  onShareAppMessage: function () {
    var id = _this.userInfo.wxapp_openid;
    var store_id = _this.store_id;
    let pageLink = '/pages/store/detail?store_id=' + store_id + '&openId=' + id
	  pageLink = common.addShareParam(pageLink)
    return {
      title: '店铺详情',
      path: pageLink,
      success: function (res) {
        var shareTickets = res.shareTickets;

        if (shareTickets.length == 0) {
          return false;
        }

        wx.getShareInfo({
          shareTicket: shareTickets[0],
          success: function (res) {
            var encryptedData = res.encryptedData;
            var iv = res.iv;
          }
        });
      }
    };
  },
  components: {},
  props: {},
  methods: {
    goGroup: function (e) {
      wx.navigateTo({
        url: '../group/detail?group_id=' + e.currentTarget.dataset.group_id
      });
    },
    callPhone: function (e) {
      common.callPhone(e.currentTarget.dataset.phone);
    },
    openMap: function (e) {
      common.openMap(e.currentTarget.dataset);
    },
    setMainContent: function (result) {
      console.log(result);
      result.store_score = parseFloat(result.store_score);

      _this.setData({
        store_data: result
      });

      wx.hideToast();
    },
    scene: function () {},
    goShop: function () {
      wx.navigateTo({
        url: '../shop_new/shopDetail/shopDetail?store_id=' + _this.store_id
      });
    },
    goPrepay: function () {
      wx.navigateTo({
        url: 'prepay?store_id=' + _this.store_id
      });
    },
    goMerchantPage: function () {
      wx.navigateTo({
        url: '../merchant/index?mer_id=' + _this.store_data.now_store.mer_id
      });
    },
    setData: function (obj) {
      let that = this;
      let keys = [];
      let val, data;
      Object.keys(obj).forEach(function (key) {
        keys = key.split('.');
        val = obj[key];
        data = that.$data;
        keys.forEach(function (key2, index) {
          if (index + 1 == keys.length) {
            that.$set(data, key2, val);
          } else {
            if (!data[key2]) {
              that.$set(data, key2, {});
            }
          }

          data = data[key2];
        });
      });
    }
  }
};
</script>
<style>
.shopDetail{
    background:white;
    padding:12rpx 12rpx 0 12rpx;
    margin-bottom:20px;
}
.imgInfo .fl image{
    width:220rpx;
    height:144rpx;
}
.imgInfo .brand{
    font-size:32rpx;
    margin-top:14rpx;
    margin-bottom:16rpx;
}
.imgInfo .star image{
    width: 24rpx;
    height: 24rpx;
    display: inline-block;
    background-size: 100%;
    margin-right: 4rpx;
}
.linkInfo{
    border-top:2rpx solid #f1f1f1;
    padding:26rpx 12rpx;
    position:relative;
    color:#999;
}
.linkInfo.link:after {
    display: block;
    content: "";
    border-top:2rpx solid #BFBFBF;
    border-left:2rpx solid #BFBFBF;
    width:16rpx;
    height:16rpx;
    -webkit-transform: rotate(135deg);
    background-color: transparent;
    position: absolute;
    top: 50%;
    right:30rpx;
    margin-top: -10rpx;
}
.linkInfo .phoneBox{
    top:0;
    right:-12rpx;
    width:124rpx;
    height:100%;
    position: absolute;
    z-index:5;
}
.linkInfo .phone{
    position: absolute;
    right: 0px;
    width: 124rpx;
    border-left:2rpx solid #eee;
    top: 30rpx;
    height:36rpx;
    background: url(https://hf.pigcms.com/tpl/Wap/pure/static/img/phoneBig.png) no-repeat;
    background-size: 36rpx;
    background-position: center center;
}


.group_list{
    padding:0 20rpx;
}


.linkInfo .icon {
    position: absolute;
    color: white;
    font-size: 24rpx;
    line-height:32rpx;
    width: 32rpx;
    height: 32rpx;
    overflow: hidden;
    text-align: center;
    top: 30rpx;
}
.linkInfo .icon.shop{
    background: #F72530;
}
.linkInfo .icon.store{
    background: #0EC0A8;
}
.linkInfo .icon.merchant{
    background: #7CC6FF;
}
.linkInfo.link .text{
    padding-left: 40rpx;
    color: #999;
}
</style>